<div class="text-center mb-6 mt-6">
    <img src="/assets/siocore-logo-full-white-text.png" alt="">
</div>
<div class="card" ng-init="loadSettings()">
    <div class="card-body p-6">
        <div class="card-title">Site information</div>


        <div class="form-group">
            <label>Site Name</label>
            <input ng-model="initCmsModel.siteName" type="text" class="form-control" placeholder="My Awesome Website...">
        </div>

        <div class="form-group">
            <label>Default Culture</label>
            <select class="custom-select form-control" ng-options="item as item.fullName for item in settings.cultures track by item.specificulture" ng-model="initCmsModel.culture"></select>
        </div>

        <div class="card-title pt-2">Database Configuration</div>
        <div class="form-group">
            <button class="btn btn-primary btn-block form-control" ng-click="initCmsModel.isUseLocal=!initCmsModel.isUseLocal">
                <span ng-if="!initCmsModel.isUseLocal">Use local database</span>
                <span ng-if="initCmsModel.isUseLocal">Use remote database</span>
            </button>
        </div>

        <form>
            <div class="form-group" ng-show="!initCmsModel.isUseLocal">
                <label>Database Type</label>
                <select class="custom-select form-control" ng-options="item as item.text for item in settings.providers" ng-model="dbProvider"></select>
            </div>
            <mssql-info ng-if="!initCmsModel.isUseLocal && dbProvider.value=='MSSQL'" init-cms-model="initCmsModel">
            </mssql-info>
            <mysql-info ng-if="!initCmsModel.isUseLocal && dbProvider.value=='MySQL'" init-cms-model="initCmsModel">
            </mysql-info>

            <mssql-local-info ng-if="initCmsModel.isUseLocal" init-cms-model="initCmsModel"></mssql-local-info>
            <hr>
            <button ng-if="!initCmsModel.isUseLocal" ng-click="initCms();" class="btn btn-primary btn-block" ng-disabled="!initCmsModel.dataBaseServer || !initCmsModel.dataBaseName || !initCmsModel.dataBaseUser || !initCmsModel.siteName || !initCmsModel.culture">
                <span ng-if="!initCmsModel.dataBaseServer || !initCmsModel.dataBaseName || !initCmsModel.dataBaseUser || !initCmsModel.siteName || !initCmsModel.culture">Next...</span>
                <span ng-if="initCmsModel.dataBaseServer && initCmsModel.dataBaseName && initCmsModel.dataBaseUser && initCmsModel.siteName && initCmsModel.culture">Connect</span>
            </button>
            <button ng-if="initCmsModel.isUseLocal" ng-click="initCms();" class="btn btn-primary btn-block" ng-disabled="!initCmsModel.sqliteDbConnectionString || !initCmsModel.localDbName|| !initCmsModel.siteName">
                <span ng-if="!initCmsModel.sqliteDbConnectionString || !initCmsModel.localDbName|| !initCmsModel.siteName">Next...</span>
                <span ng-if="initCmsModel.sqliteDbConnectionString && initCmsModel.localDbName && initCmsModel.siteName">Next...</span>
            </button>
        </form>

    </div>
</div>

<!-- <div class="header-3" ng-init="loadSettings()">
    <nav class="navbar navbar-expand-lg navbar-transparent bg-primary navbar-absolute">
        <div class="container">
            <div class="navbar-translate">
                <a class="navbar-brand" href="#siocore">siocore</a>
            </div>
        </div>
    </nav>

    <div id="carouselExampleIndicators" class="carousel slide" data-pause="pause">
        <div class="carousel-inner" role="listbox">
            <div class="carousel-item active">
                <div class="page-header header-filter">
                    <div class="page-header-image"></div>
                    <div class="content-center">
                        <div class="container text-left">
                            <div class="content-center">
                                <div class="row">
                                    <div class="col-md-5">
                                        <h5>Database Configuration</h5>
                                        <img src="{{dbProvider.img}}" />
                                    </div>

                                    <div class="col-md-6 ml-auto mr-auto text-right">


                                        <div class="form-group">
                                            <label>Site Name</label>
                                            <input ng-model="initCmsModel.siteName" type="text" class="form-control"
                                                placeholder="My Awesome Website...">
                                        </div>

                                        <div class="form-group">
                                            <label>Default Culture</label>
                                            <select class="custom-select form-control"
                                                ng-options="item as item.fullName for item in settings.cultures track by item.specificulture"
                                                ng-model="initCmsModel.culture"></select>
                                        </div>

                                        <hr />
                                        <h5>
                                            <a class="btn btn-primary"
                                                ng-click="initCmsModel.isUseLocal=!initCmsModel.isUseLocal">
                                                <span ng-if="!initCmsModel.isUseLocal">Use local database</span>
                                                <span ng-if="initCmsModel.isUseLocal">Use remote database</span>
                                            </a>
                                        </h5>
                                        <form>
                                            <div class="form-group" ng-show="!initCmsModel.isUseLocal">
                                                <label>Database Type</label>
                                                <select class="custom-select form-control"
                                                    ng-options="item as item.text for item in settings.providers"
                                                    ng-model="dbProvider"></select>
                                            </div>
                                            <mssql-info ng-if="!initCmsModel.isUseLocal && dbProvider.value=='MSSQL'"
                                                init-cms-model="initCmsModel"></mssql-info>
                                            <mysql-info ng-if="!initCmsModel.isUseLocal && dbProvider.value=='MySQL'"
                                                init-cms-model="initCmsModel"></mysql-info>

                                            <mssql-local-info ng-if="initCmsModel.isUseLocal"
                                                init-cms-model="initCmsModel"></mssql-local-info>
                                            <hr />
                                            <button ng-if="!initCmsModel.isUseLocal" ng-click="initCms();"
                                                class="btn btn-primary btn-round"
                                                ng-disabled="!initCmsModel.dataBaseServer || !initCmsModel.dataBaseName || !initCmsModel.dataBaseUser || !initCmsModel.siteName || !initCmsModel.culture">
                                                <span
                                                    ng-if="!initCmsModel.dataBaseServer || !initCmsModel.dataBaseName || !initCmsModel.dataBaseUser || !initCmsModel.siteName || !initCmsModel.culture">Next...</span>
                                                <span
                                                    ng-if="initCmsModel.dataBaseServer && initCmsModel.dataBaseName && initCmsModel.dataBaseUser && initCmsModel.siteName && initCmsModel.culture">Connect</span>
                                            </button>
                                            <button ng-if="initCmsModel.isUseLocal" ng-click="initCms();"
                                                class="btn btn-primary btn-round"
                                                ng-disabled="!initCmsModel.sqliteDbConnectionString || !initCmsModel.localDbName|| !initCmsModel.siteName">
                                                <span
                                                    ng-if="!initCmsModel.sqliteDbConnectionString || !initCmsModel.localDbName|| !initCmsModel.siteName">Next...</span>
                                                <span
                                                    ng-if="initCmsModel.sqliteDbConnectionString && initCmsModel.localDbName && initCmsModel.siteName">Next...</span>
                                            </button>
                                        </form>


                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="carousel-item">
                <div class="page-header header-filter">
                    <div class="page-header-image"></div>
                    <div class="content-center">
                        <div class="container">
                            <div class="content-center">
                                <div class="row">
                                    <div class="col-md-8 ml-auto mr-auto text-center">
                                        Step 2
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="carousel-item">
                <div class="page-header header-filter">
                    <div class="page-header-image" style="background-image: url('assets/img/bg17.jpg');"></div>
                    <div class="content-center">
                        <div class="container">
                            <div class="content-center">
                                <div class="row">
                                    <div class="col-md-6 text-left">
                                        Step 3
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div> -->
